<script setup lang="ts">
import { Decoration5 } from "@kjgl77/datav-vue3";
import HeaderBg from '../assets/head_bg.png';
</script>
<template>
  <div class="flex items-center w-full h-full header-bg">
    <img :src="HeaderBg" alt="" />
    <span class="text-white absolute text-center w-full">
      汽车循环数据看板
    </span>
    <span class="text-white absolute text-center w-full">
      <Decoration5 class="mt-5.6" :dur="10" />
    </span>
  </div>
</template>
<style scoped lang="less">
.header-bg {
  width: 100%;
  height: 70px;

  img {
    width: 100%;
    height: 70px;
  }

  span {
    top: 15px;
    font-size: 30px;
    letter-spacing: 5px;
  }
}

.header-left {
  flex: 0 0 28%;
}


.header-right {
  flex: 0 0 28%;
}
</style>
